<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<html>
<head>
	<meta charset="UTF-8">
    <title>工作人员信息</title>
    <%@ include file="head.jsp" %>
</head>
<body>
<blockquote class="layui-elem-quote" style="margin-top: 20px;margin-left: 10px;">工作人员信息管理</blockquote>
<div class="layui-tab-item layui-show" style="margin-left: 10px">
	<div class="layui-col-md12" style="height:50px;position:static;">
		<button id="add" style="position:absolute;left:88%;" class="layui-btn layui-btn-normal">添加用户</button>
	</div>
	 
	<table class="layui-table" lay-data="{ height:432, url:'selectUserAll', page:true, id:'idTest'}" lay-filter="demo">
	  <thead>
	    <tr>
	      <th lay-data="{type:'numbers', fixed: 'left'}">序号</th>
	      <th lay-data="{field:'id', sort: true, fixed: true}">ID</th>
	      <th lay-data="{field:'user_name'}">用户名</th>
	      <th lay-data="{field:'user_password'}">密码</th>
	      <th lay-data="{field:'user_power'}">级别</th>
	      <th lay-data="{field:'sex'}">性别</th>
	      <th lay-data="{field:'bir'}">生日</th>
	      <th lay-data="{fixed: 'right', align:'center', toolbar: '#barDemo'}"></th>
	    </tr>
	  </thead>
	</table>
 </div>
<script type="text/html" id="barDemo">
  
  <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  <a id="sanchu" class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
                   

<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>
layui.use('table', function(){
  var table = layui.table;
  var $ = layui.$;
  
  $("#add").click(function(){
	  layer.open(
              {
                  type: 2,
                  title: '添加员工信息',
                  shadeClose: true,
                  shade: 0.8,
                  area: ['400px', '80%'],
                  content: 'userAdd' 
              })
	  
  })
  var name = '${sessionScope.user_name}';
  var id = '${sessionScope.id}' ;
  var deg = '${sessionScope.deg}' ;
  //alert("name " + name + ",id " + id + ", deg " +deg) ;
  //监听表格复选框选择
  table.on('checkbox(demo)', function(obj){
    console.log(obj)
  });
  //监听工具条
  table.on('tool(demo)', function(obj){
    var data = obj.data;
    if(obj.event === 'detail'){
      layer.msg('ID：'+ data.id + ' 的查看操作');
    } else if(obj.event === 'del'){
      layer.confirm('真的删除行么', function(index){
        //obj.del();
        $.ajax({
        	url:'deleteUserById'
        	,data:{id:data.id}
        	,success:function(){
		        layer.close(index);
        		location.reload();
        	}
        	
        })
      });
    } else if(obj.event === 'edit'){
    	layer.open(
                {
                    type: 2,
                    title: '修改'+data.id + '号员工信息',
                    shadeClose: true,
                    shade: 0.8,
                    area: ['400px', '80%'],
                    content: 'user_revise?id=' + data.id
                })
      //layer.alert('编辑行：<br>'+ JSON.stringify(data))
    }
  });
  
  var $ = layui.$, active = {
    getCheckData: function(){ //获取选中数据
      var checkStatus = table.checkStatus('idTest')
      ,data = checkStatus.data;
      layer.alert(JSON.stringify(data));
    }
    ,getCheckLength: function(){ //获取选中数目
      var checkStatus = table.checkStatus('idTest')
      ,data = checkStatus.data;
      layer.msg('选中了：'+ data.length + ' 个');
    }
    ,isAll: function(){ //验证是否全选
      var checkStatus = table.checkStatus('idTest');
      layer.msg(checkStatus.isAll ? '全选': '未全选')
    }
  };
  
  $('.demoTable .layui-btn').on('click', function(){
    var type = $(this).data('type');
    active[type] ? active[type].call(this) : '';
  });
});
</script>



</body>
</html>